<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<style type="text/css">
			*{
				margin: 0;
				padding: 0;
			}
			li{
				list-style: none;
			}
			a{
				text-decoration: none;
			}
			.rongqi{
				width: 100%;
				min-width: 320px;
				position: relative;
				margin: 0 auto;
			}
			.top{
				width: 100%;
				height: 1.6rem;
				background-image: url(nav.png);
				background-repeat: no-repeat;
				background-size: 100% 100%;
				background-position: center;
				position: fixed;
				top: 0;
				left: 0;
			}
			.top a{
				height:0.67rem ;
				width:0.4rem ;
				background-image:url(01.png) !important;
				background-repeat: no-repeat !important;
				background-size: 100% 100% !important;
				background-position: center;
				display:inline-block;
				position: absolute;
				top: 50%;
				left: 0.8rem;
				transform: translateY(-50%);
			}
			.top p{
				font-size: 0.53rem;
				color: white;
				text-align: center;
				line-height: 1.6rem;
			}
			
			
			.shouji{
				font-size:0.427rem ;
				width: 8.93rem;
				height: 1.47rem;
				margin:0 auto;
				margin-top: 1.6rem;
					border-bottom: 1px solid black;
			}
			.shouji input{
				font-size:0.427rem ;
				width:8.93rem ;
				height:0.8rem ;
				margin-top: 0.4rem;
				padding-left:0.3rem;
				box-sizing: border-box;	
			}
			
			
			
			
			.yanzhen{
				font-size:0.427rem ;
				width: 8.93rem;
				height: 1.47rem;
				margin: 0.5rem auto;
					border-bottom: 1px solid black;
			}
			.yanzhen input{
				font-size:0.427rem ;
				width:6.5rem ;
				height:0.8rem ;
				padding-left:0.3rem;
				box-sizing: border-box;
				margin-top: 0.4rem;
			}
			.a{
				outline:none;
				border: none;
				background: white;
			}
			
			
			.denlu{
				font-size:0.427rem ;
				width: 8.93rem;
				height: 1.47rem;
				margin:0.5rem auto;
					border-bottom: 1px solid black;
			}
			.denlu input{
				font-size:0.427rem ;
				width:8.93rem ;
				height:0.8rem ;
				margin-top: 0.4rem;
				padding-left:0.3rem;
				box-sizing: border-box;	
			}
			
			
			.b{
				font-size:0.427rem ;
				width: 8.93rem;
				height: 1.47rem;
				margin: 0 auto;
				margin-top: 1.6rem;
				
			}
			.liji{
				width:5.87rem ;
				height:1.47rem ;
				font-size: 0.28rem;
				background:#f23a38;
				color: white;
				border-radius: 0.35rem;
				margin-left: 1.6rem;
				outline: none;
			}

		
		</style>
		<script src="flexible.js"></script>
		<script src="jquery-3.3.1.min.js"></script>
	</head>
	<body>
		<div class="rongqi">
			<div class="top">
				<a href="javascript:history.go(-1)"></a>
				<p>忘记密码</p>
			</div>
			
			<div class="shouji">
				<input type="text" placeholder="请输入您的手机号"/>
			</div>
			
		<div class="yanzhen">
			<input type="text" placeholder="输入验证码"/>
			<span class="a">获取验证码</span>
		</div>
		
		
		<div class="denlu">
			<input type="text" placeholder="请输入6-20位密码" />
		</div>
		
		
		<div class="denlu">
			<input type="text" placeholder="请再次输入密码" />
		</div>
		
		
		<div class="b">
		<button class="liji">确认</button>
		</div>
		
		</div>

	</body>
	<script>
			$(function(){
			$(".a").click(function(){
				var $a=60
				$timer=setInterval(function(){
					var $dao=$a--
					if($dao==0){
						clearInterval($timer)
					}
					if($(".a").text>0){
						$(".a").attr({"disabled":"disabled"})
					}
					
				 $(".a").text($dao+"s")
				 
				},1000)
				
				
				
				
				
			})
			
		})
	</script>
</html>
